<template>
	<view>
		<uni-card padding="1" margin="1">
			<view style="display: flex;">
				<view style="flex: 1;">
					<image :src="school.image" class="image4"></image>
				</view>
				<view class="text1">{{school.schoolname}}贴吧</view>
			</view>
		</uni-card>
		<view style="margin: 150rpx 0rpx;text-align: center;"  v-if="list[0]==null">
			<image src="../../static/zanwu.png" class="img3"></image>
		</view>
		<uni-card @click="onClick(i)" :title="i.title" :sub-title="'发布日期:'+i.createtime" v-for="i in list">
			<image slot='cover' :src="image" v-for="image in i.imageList.slice(0,3)" mode="aspectFill"
				:class="i.imageList.length==1?'image1':(i.imageList.length==2?'image2':'image3')" @click="onClick(i)" v-if="i.imageList.length>0"></image>
			<view class="view1">{{i.content}}</view>
		</uni-card>
		<view style="height: 30rpx;"></view>
	</view>
</template>
<script>
	import {
		selectpostbarlist,
		selectschoollist,
		selectschoolname
	} from '../../api/myapi'
	export default {
		data() {
			return {
				list: [],
				school:{}
			}
		},
		methods:{
			onClick(i){
				uni.navigateTo({
					url:'./detail?id='+i.id
				})
			}
		},
		async onShow() {
			let r2 = await selectschoolname({
				id: uni.getStorageSync("userid")
			})
			let r1 = await selectschoollist({
				schoolname:r2.data.userSchool
			})
			this.school = r1.data[0]
			let r = await selectpostbarlist({
				school:this.school.schoolname
			})
			console.log(r);
			this.list = r.data
		}
	}
</script>
<style>
	.img3 {
		width: 350rpx;
		height: 350rpx;
	}
	.text1 {
		font-size: 40rpx;
		font-weight: 700;
		margin-top: 40rpx;
		line-height: 70rpx;
		flex: 1;
	}
	.view1 {
		height: 78rpx;
		overflow: hidden;
		
	}
	.image1 {
		width: 100%;
		margin-top: 20rpx;
		border-radius: 16rpx;
		height: 300rpx;
	}

	.image2 {
		width: 47%;
		margin-top: 20rpx;
		border-radius: 16rpx;
		height: 300rpx;
		margin-left: 14rpx;
		border: 1rpx solid #dcdcdc;
	}

	.image3 {
		width: 30%;
		margin-top: 20rpx;
		border-radius: 16rpx;
		height: 200rpx;
		margin-left: 18rpx;
		border: 1rpx solid #dcdcdc;
	}
	.image4 {
		width: 200rpx;
		height: 200rpx;
		border-radius: 50%;
	}
</style>